<template>
  <div class="form-layout">
    <!--左侧导航-->
    <div class="nav-left">
      <customAnchor
        :itemList="[
          { name: 'box-base', title: '基础信息' },
          { name: 'box-dtl', title: '设备信息' },
        ]"
      />
    </div>
    <!--表单区域-->
    <div class="form-right" ref="formRight">
      <customForm :data="form" :rules="propRules" ref="editForm" :disabled="propReadonly">
        <template #content>
          <div id="box-base" class="box-title">基础信息</div>
          <customFormItem
            label="借用科室"
            name="borrowDeptName"
            :parent="_self"
            :form="form"
            :readonly="true"
            :showSelectIcon="true"
            @focus="utilSelect.dept(borrowDeptNameChange)"
            :disabled="!propParent.cpFormNew"
          />

          <customFormItem
            label="借出科室"
            name="lendDeptName"
            :parent="_self"
            :form="form"
            :readonly="true"
            :showSelectIcon="true"
            @focus="utilSelect.dept(lendDeptNameChange)"
            :disabled="!propParent.cpFormNew"
          />


          <customFormItem label="归还日期" name="busDate" :parent="_self" :form="form"  :type="constCommon.formItemType.datePicker.name" disabled />
          <customFormItem label="归还人" name="busUser" :parent="_self" :form="form"  disabled/>
          <customFormItem label="归还电话" name="busPhone" :parent="_self" :form="form"  />
          <customFormItem label="业务单号" name="busKey" :parent="_self" :form="form"  disabled/>
          <customFormItem label="备注" name="remark" :parent="_self" :form="form"  />
        </template>
      </customForm>

      <div id="box-dtl" class="box-title">设备信息</div>
      <customTooltip title="title" v-show="!propReadonly && !propParent.cpFormNew">
        <template #title>
          选择设备或者扫描设备标签码
        </template>
        <template #content>
          <FortenScan ref="scan" propPlaceholder="请扫描" style="width: 300px;margin-top: 10px;display: inline-block; margin-right: 5px" @after-scan="barCodeScan" propType="uniqueCode"/>
          <customButton title="选择设备" theme="primary" @click="$refs.tableDrawerDtl.show(deviceSelect, true)" style="height: 35px;line-height: 35px;"/>
        </template>
      </customTooltip>
      <data-view ref= "childDataView"
                 :propHideFlowSelect = "true"
                 propViewKey="device_circulate_item_return"
                 :propFlowKey="propParent.propFlowKey"
                 :propInitData="form"
                 :propParentPage="_self"
                 :propParentData="propParent.viewFormData"
                 :propAutoFetchData="false"
                 :propsDisableDbClick="true"
                 :propTableHide="propParent.cpFormNew"
                 propTableHideMsg="请先保存主单据"
                 class="data-view-inlinebtn"
                 @afterTableDataChange="afterTableDataChange"
      />
    </div>

    <!--租赁明细选择-->
    <tableDrawer ref="tableDrawerDtl" refName="tableDrawerDtl" viewKey="device_circulate_item_select" attach="body"
                 loadForce
                 :queryWrapper="$newWrapper().eq('borrow_dept_id', strings.defaultIfBlank(form.borrowDeptId, -1)).eq('lend_dept_id', strings.defaultIfBlank(form.lendDeptId, -1))"
                 :propUserParam="{busType: constCommon.dictType.deviceCirculateBusTypeReturn}"
                 subtitle="已完成租赁明细、借用借出科室筛选"
    />
  </div>
</template>

<script>
import customAnchor from '@/components/custom/form/customAnchor.vue'

export default {
  desc: '设备租赁、归还-详情',
  data() {
    return {
      form: {},
    }
  },
  created() {
    this.$emit('event-register', {
      //表单校验
      validate: (callback) => {
        return this.$refs.editForm.validate(callback)
      },

      //保存前操作
      beforeSave: () => {
        this.$emit('data-callback', this.form)
        if (this.strings.isNotBlank(this.form.lendDeptName) && this.strings.isNotBlank(this.form.borrowDeptName) && this.form.lendDeptName == this.form.borrowDeptName) {
          this.utilMessage.warning('借出科室与借入科室一样，请调整')
          return false
        }
        return true
      },

      //数据加载后
      afterMove: (formData, initData) => {
        this.form = global.utils.jsonClone(formData)
        if (this.propParent.cpFormNew) {
          this.$set(this.form, 'busType', this.constCommon.dictType.deviceCirculateBusTypeReturn)
          this.$set(this.form, 'busUser', this.utils.getCurrentUser().name)
          this.$set(this.form, 'borrowDeptId', this.utils.getCurrentUser().deptId)
          this.$set(this.form, 'borrowDeptName', this.utils.getCurrentUser().deptName)
          this.$set(this.form, 'busDate', new Date().format(this.dates.defaultDatePattern))
          this.$set(this.form, 'busKey', '自动获取')
        }
        this.loadDtl()
      },

      //数据保存后
      afterSave: () => {
      },
      beforeDelete: () => {
        return true
      },

      //数据删除后
      afterDelete: () => {
      },

      //流程提交前
      beforeFlow: (flowButtonKey) => {
        return true
      },

      //流程提交后
      afterFlow: (flowButtonKey) => {
      },

      //表单关闭前
      beforeClose: () => {
        return true
      }
    })
  },
  props: {
    //上级对象
    propParent: Object,
    //上级初始化数据
    propInitData: Object,
    //主键字段
    propPrimaryKey: String,
    //数据字典
    propDictionaries: Object,
    //当前操作行
    propCurrentRow: Object,
    //表单数据
    propViewFormData: Object,
    //是否只读
    propReadonly: Boolean,
    //操作状态
    propStatus: String,
    //表单规则
    propRules: Object
  },
  components: {
    customAnchor
  },
  methods: {
    // 加载明细
    loadDtl() {
      let queryWrapper = this.$newWrapper()
      if (!this.propParent.cpFormNew) {
        queryWrapper.eq('circulateId', this.form.id)
      } else {
        queryWrapper.eq('circulateId', -1)
      }
      this.$refs.childDataView.setQueryWrapper(queryWrapper)
    },

    // 明细 新增、删除、修改后调用
    afterTableDataChange() {
      this.utils.refreshRefs(this)
    },
    // 设备选择
    deviceSelect(rows) {
      //转换属性
      rows.forEach(ob => {
        ob.ledgerId = ob.ledgerId
        ob.circulateId = this.form.id
        ob.woItemId = ob.id
        ob.id = null
      })

      //批量添加
      this.utilVue.loadShow(true)
      this.$ajax.post('/device/circulate_item/saveBatch', rows).then(resp => {
        this.utilVue.loadHide()
        if (resp.code == 0) {
          this.utilMessage.success(resp.msg)
          this.loadDtl()
        }
      })
    },
    lendDeptNameChange(item) {
      this.$set(this.form, 'lendDeptId', item.id)
      this.$set(this.form, 'lendDeptName', item.name)
    },
    borrowDeptNameChange(item) {
      this.$set(this.form, 'borrowDeptId', item.id)
      this.$set(this.form, 'borrowDeptName', item.name)
    },
    //扫码SN或RFID
    barCodeScan(txtScan) {
      this.utilVue.loadShow(true)
      this.$ajax.post('/device/circulate_item/addByScan?txtScan', {
        'circulateId': this.form.id,
        'deviceSn': txtScan
      }).then(
        resp => {
          if (resp.code == 0) {
            this.utilMessage.success(resp.msg)
            this.loadDtl()
          }
          this.utilVue.loadHide()
        }
      )
    }
  }
}
</script>
